<template>
  <div class="draw-dialog">
    <el-dialog v-model="isShow" title="流程图绘制" width="1600">
      <drawPanel v-if="isShow" :dataSrc="dataSrc" @closeHandle="closeHandle"></drawPanel>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import drawPanel from '../components/drawPanel.vue'

const dataSrc = ref('')

const emits = defineEmits(['closeHandle'])

const isShow = ref(false)

const closeHandle = (data) => {
  emits('closeHandle', data)
  canel()
}

const openDialog = (data) => {
  dataSrc.value = data
  isShow.value = true
}

const canel = () => {
  isShow.value = false
}

defineExpose({ openDialog, canel })
</script>

<style lang="scss" scoped>
:deep(.el-dialog) {
  height: 100vh;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  .el-dialog__body {
    flex: 1;
    #draw-box {
      height: 100%;
    }
  }
}
</style>
